import React from 'react';
import useTable from "@/cms/use/useTable";
import {Button, message, Modal, Space} from "antd";
import useAddEdit from "./useAddEdit";
import {roleList, operatorStatusList} from "@/pages/constant";
import useFilter from "@/cms/use/useFilter";

function Operator(props) {
    const {queryList,tableDOM} = useTable({
        columns:[
            {
                title:"姓名",
                dataIndex:"realName",
            },{
                title:"登录账号",
                dataIndex:"phone"
            },
            {
                title:"手机号",
                dataIndex:"detail"
            },
            {
                title:"操作",
                render(_,record){
                    return <Space>
                        <a onClick={()=>setOpen?setOpen(record):""}>查看</a>
                        <a style={{color:"red"}} onClick={()=>remove(record)}>删除</a>
                    </Space>
                }
            }
        ],
        xhr:{
            query:"/api/userList"
        }
    })

    const {ModalDOM,setOpen} = useAddEdit({
        queryList
    })
    const {FilterDOM} = useFilter({
        queryList,
        list:[
            {
                label:"角色",
                name:"role",
                type:"select",
                options:roleList
            },
            {
                label:"状态",
                name:"status",
                type:"select",
                options:operatorStatusList
            }
        ]
    })
    function remove(record){
        Modal.confirm({
            title:"确认要删除吗？",
            onOk(){
                return new Promise((resolve, reject) => {
                    ax.post("/api/deleteUser",{
                        id:record.ID
                    }).then(res=>{
                        message.success(res.msg);
                        queryList({
                            current:1
                        });
                        resolve()
                    }).catch(err=>{
                        reject(err)
                    })
                })
            }
        })

    }
    return (
        <div>
            {ModalDOM}
            {FilterDOM}
            <Button type={"primary"} onClick={()=>setOpen(true)}>添加</Button>
            {tableDOM}
        </div>
    );
}

export default Operator;